<template>
	<div class="mainContent">
		<pathTracking :path='Model.path' />
		<div class="deliverynoti-container">
			<div class="addcont">
				<div class="add"  @click="Toaddnew">
					<img class="plus" src="@/assets/img/button_plus.png" alt="">
					<p class="font">新建盘点任务</p>
				</div>
			</div>
			<div class="bgWhite bgRadius">
				<card :configArr="Model.configArr"></card>
				<el-row>
					<div class="common-table-title">
						<div class="common-table-icon"></div>
						<div class="common-table-fl">查询条件</div>
					</div>
				</el-row>
				<!-- 高级搜索 -->
				<advancedSearch :option="Model.filterOption" @getChild="showChild" @onSearch="toSearch" @onClear="toClear" @onExport="toExport"></advancedSearch>
			</div>
			<!-- 表格 -->
			<div class="table">
				<el-row>
					<div class="common-table-title">
						<div class="common-table-icon"></div>
						<div class="common-table-fl">盘点列表</div>
						<div class="common-btn-group">
							<div class="common-table-btn-item" >导出</div>
							
						</div>
					</div>
				</el-row>
				<el-row class="table-bg">
					<el-table :data="Model.tableData" stripe border style="width: 100%" @selection-change="handleSelectionChange">
						<el-table-column type="selection" width="50" fixed></el-table-column>
						<el-table-column fixed prop="countingNumber" label="盘点单号" width="200">
							<template slot-scope="scope">
								<el-button v-if="scope.row.inventoryStatus == 3|| scope.row.inventoryStatus == 4 || scope.row.inventoryStatus == 5" type="text" @click="tableDetail(scope.row,'1','1')">{{scope.row.countingNumber}}</el-button>
								<el-button v-else type="text" @click="tableDetail(scope.row,'1','0')">{{scope.row.countingNumber}}</el-button>
								<!--<el-button type="text" @click="tableDetail(scope.row,'1','0')">{{scope.row.countingNumber}}</el-button>-->
							</template>
						</el-table-column>
						<el-table-column 
							v-for="(item,index) in Model.tableHeaderData"
							:key="item.prop"
							:prop="item.prop" 
							:label="item.label" 
							:width="item.width" 
							:sortable="item.sortable"
						></el-table-column>
						<el-table-column fixed="right" :label="$t('common.handleOption')" width="240">
							<template slot-scope="scope">
								<div class="btnGroup">
									<div v-if="scope.row.inventoryStatus == 1" @click="tableDetail(scope.row,'0','1')" class="operate-btn">开始盘点</div>
                                    <div v-if="scope.row.inventoryStatus == 2">
                                        <div @click="tableDetail(scope.row,'0','1')" class="operate-btn">继续盘点</div>
                                        <div @click="endInventory(scope.row,this,'结束盘点')" class="operate-btn">结束盘点</div>
                                    </div>
                                    <div v-if="scope.row.inventoryStatus == 3">
                                        <div @click="endInventory(scope.row,this,'反审核')" class="operate-btn">反审核</div>
                                        <div @click="submitReport(scope.row)" class="operate-btn">提交盘点报告</div>
                                    </div>
								</div>
							</template>
						</el-table-column>
					</el-table>
				</el-row>	
				<!-- 分页 -->
				<el-row class="pagination-cont">
				    <el-pagination
						@size-change="handleSizeChange"
						background
						@current-change="handleCurrentChange"
						:current-page="Model.paginationObject.currentPage"
						:page-sizes="[10, 20, 30, 40]"
						:page-size="Model.paginationObject.pageSize"
						:pager-count="5"
						layout="sizes, prev, pager, next, jumper, slot"
						:total="Model.paginationObject.total">
						<div class="pagination-slot">
							显示
							<p class="slot-i">{{Model.paginationObject.num1}}</p>
							到
							<p class="slot-i">{{Model.paginationObject.num2}}</p>
							，共
							<p class="slot-i">{{Model.paginationObject.total}}</p>
							记录
						</div>
				    </el-pagination>
				</el-row>	
			</div>
		</div>
		<!-- 新建盘点任务 -->
		<el-dialog :visible.sync="Model.Addnewtask" top="100px" class="Addnewtask">
			<div class="common-table-title">
				<div class="common-table-icon"></div>
				<div class="common-table-fl">提示</div>
			</div>
			<div class="AddnewtaskCort">
				<div class="AddnewtaskFirst">
					<el-row>
						<label>盘点工厂：</label>
						<el-select class="input-cont" filterable v-model="Model.Inventoryfactory" placeholder="请输入内容">
							<el-option v-for="(data,index) in Model.allfactory" :key="index" :label="data.label" :value="data.value"></el-option>
						</el-select>
					</el-row>
					<el-row>
						<label>盘点库位：</label>
						<el-select class="input-cont" filterable multiple v-model="Model.Inventorylocation" placeholder="请输入内容">
							<el-option v-for="(data,index) in Model.alllocation" :key="index" :label="data.label" :value="data.value"></el-option>
						</el-select>
					</el-row>
					<el-row>
						<label>特殊库存标识：</label>
						<el-select class="input-cont" filterable v-model="Model.defaultOt" placeholder="请输入内容">
							<el-option label="O" value="O"></el-option>
						</el-select>
						<p style="color: #f00;margin-top: 10px;">提示：盘点供应商库存才需要选择库存标识</p>
					</el-row>
					<el-row>
						<label>供应商编码：</label>
						<el-select class="input-cont" filterable v-model="Model.defaultInfo" placeholder="请输入内容">
							<el-option v-for="(data,index) in Model.infosArr" :key="index" :label="data.label" :value="data.value"></el-option>
						</el-select>
						<p style="color: #f00;margin-top: 10px;">提示：如需盘点具体供应商请选择</p>
					</el-row>
				</div>
				<div class="viewDialogFooter">
					<div class="viewDialogFooterSure" @click="sureAddtask">确定</div>
					<div class="viewDialogFooterCancel"  @click="Model.Addnewtask = false">取消</div>
				</div>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import pathTracking from '@/components/common/pathTracking'
	import pagination from "@/components/common/pagination.vue";
	import card from '@/components/common/filterBtns';
	import advancedSearch from "@/components/common/filter/advancedSearch";
	import {
		getDateString
	} from "@/assets/js/common.js"
	import Model from './model.js'
	import Controller from './controller.js'
	export default {
		name: "purchase",
		mixins: [Model, Controller],
		components: {
			advancedSearch,
			pagination,
			pathTracking,
			card
		},
	};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
	@import "./index.less";
</style>